<template>
  <div>
    <div>
      <h2>数据统计</h2>
    </div>
    <div class="display_panel">
      <div>
        <barwaterfall></barwaterfall>
      </div>
      <div>
        <linechart></linechart>
      </div>
      
    </div>
    <div class="display_waterfall">
        <barchart :datalist="barData"></barchart>
    </div>
  </div>
</template>

<script>
import barchart from "@/components/echarts/BarChart.vue";
import linechart from "@/components/echarts/LineChart.vue";
import barwaterfall from "@/components/echarts/BarWaterfall.vue";
export default {
  name: "DataView",
  components: {
    barchart,
    linechart,
    barwaterfall,
  },
  data() {
    return {
      barData: [120, 250, 160, 80, 70, 110, 130],
    };
  },
};
</script>

<style scoped>
.display_panel {
  display: flex;
}

.display_waterfall {
  display: flex;
}
</style>